import { Label } from "cc"
import { _decorator, Component, Node } from "cc"
import { ClientEvent } from "../framework/ClientEvent"
import { GlobalData } from "../GlobalData"
import { Tween } from "cc"
import { SpriteFrame } from "cc"
import { Sprite } from "cc"
import { Color } from "cc"
import { AudioManager } from "../framework/AudioManager"
const { ccclass, property } = _decorator

@ccclass("UIGameBuffItem")
export class UIGameBuffItem extends Component {
  public indexBuff: number = 0

  @property(Label)
  labCoin: Label = null!

  @property(Sprite)
  sprTitle: Sprite = null!

  @property(Sprite)
  sprIcon: Sprite = null!

  @property([Node])
  arrNodeColorBg: Node[] = []

  @property([SpriteFrame])
  arrSprFTitle: SpriteFrame[] = []

  @property([SpriteFrame])
  arrSprFIcon: SpriteFrame[] = []

  @property(Node)
  nodeMask: Node = null!

  private needCoin: number = 0

  private curLevel:number = 0

  start() {
    this.firstScale = this.node.scaleX
    this.onBuffEventChange()
    this.onCoinValueChange()
    this.sprIcon.spriteFrame = this.arrSprFIcon[this.indexBuff]
    this.sprTitle.spriteFrame = this.arrSprFTitle[this.indexBuff]
    for (let i: number = 0; i < this.arrNodeColorBg.length; i++) {
      this.arrNodeColorBg[i].active = i == this.indexBuff
    }
  }

  protected onEnable(): void {
    const arrEventName: string[] = [
      "onGAttackChange",
      "onGAttackSpeedChange",
      "onGDefenseChange",
      "onGHealthRecoveryChange",
    ]
    const curEventName = arrEventName[this.indexBuff]
    ClientEvent.on(curEventName, this.onBuffEventChange, this)
    ClientEvent.on("onCoinValueChange", this.onCoinValueChange, this)
    this.node.on(Node.EventType.TOUCH_START, this.onTouchStart, this)
  }

  update(deltaTime: number) {}

  private onBuffEventChange() {
    let curCoinValue = this.curLevel
    curCoinValue = 250 + curCoinValue * 50
    this.labCoin.string = curCoinValue + ""
    this.needCoin = curCoinValue
    this.onCoinValueChange()
  }

  private onCoinValueChange() {
    this.nodeMask.active = GlobalData.instance.coinValue < this.needCoin
  }

  private firstScale: number = 0
  private onTouchStart() {
    Tween.stopAllByTarget(this.node)

    if (GlobalData.instance.coinValue >= this.needCoin) {
      new Tween(this.node)
        .to(0.1, { scaleXYZ: 0.9 * this.firstScale })
        .to(0.1, { scaleXYZ: this.firstScale })
        .start()
      GlobalData.instance.coinValue -= this.needCoin
      ClientEvent.emit("onSkillUpgradeChange")
      this.curLevel++
      switch (this.indexBuff) {
        case 0: {
          GlobalData.instance.gAttack++
          GlobalData.instance.gAttackSpeed++
          break
        }
        case 1: {
          GlobalData.instance.gAttackSpeed++

          break
        }
        case 2: {
          GlobalData.instance.gDefense++
          GlobalData.instance.gAttackSpeed++
          break
        }
        case 3: {
          GlobalData.instance.gHealthRecovery++
          GlobalData.instance.gAttackSpeed++
          break
        }
      }
      if(GlobalData.instance.gAttack < 2){
        GlobalData.instance.gAttack++
      }
    } else {
      AudioManager.instance.playEffect("sm_no_money")
    }
  }
}
